import { useCallback } from "react";
import { useSelector, useDispatch } from "react-redux";
import tabsApi from "../api/tabs";
import Creators from "../store/actions";

export const useTabs = () => {
  const tabs = useSelector((state) => state.tabs);
  const dispatch = useDispatch();
  const getAllTabs = useCallback(
    async (navsId) => {
      const data = await tabsApi.getTabs(navsId);
      dispatch(Creators.getAllTabs({ data }));
    },
    [dispatch]
  );
  return [tabs, { getAllTabs }];
};
